import React from 'react'; //react 模板
import ReactDOM from 'react-dom'; //  jax语法
import './index.css';// 全局样式
import App from './App'; // 主要模块
import * as serviceWorker from './serviceWorker'; //渲染问题
import { BrowserRouter } from "react-router-dom"; //路由


import { Provider } from 'react-redux'; // 数据传递 

//import store from './redux/store'; // store 数据管理

import store from './redux/store'; // store 数据管理

ReactDOM.render(
  // BrowserRouter===Router
  <BrowserRouter> 
  {/* <React.StrictMode> */}
  <Provider store={store}>
    <App />
    </Provider>
  {/* </React.StrictMode> */}
  </BrowserRouter>,
  document.getElementById('root')
);

// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: https://bit.ly/CRA-PWA
serviceWorker.unregister();

// import  React,{ Component } from 'react';
// import ReactDOM from 'react-dom';

// import { createStore } from 'redux';
// import { Provider, connect } from 'react-redux';
 
// class App extends Component {
//     render() {
//         const { PayIncrease, PayDecrease } = this.props;
//         return (
//             <div className="App">
//                 <div className="App">
//                     <h2>当月工资为{this.props.tiger}</h2>
//                     <button onClick={PayIncrease}>升职加薪</button>
//                     <button onClick={PayDecrease}>迟到罚款</button>
//                 </div>
//             </div>
//         );
//     }
// }
 
// const tiger = 10000
 
// //这是action
// const increase = {
//     type: '涨工资'
// }
// const decrease = {
//     type: '扣工资'
// }
 
// //这是reducer
// const reducer = (state = tiger, action) => {
//     switch (action.type) {
//         case '涨工资':
//             return state += 100;
//         case '扣工资':
//             return state -= 100;
//         default:
//             return state;
//     }
// }
 
// //把reducer放到createStore里， 并创建store
// const store = createStore(reducer);
 
// //需要渲染什么数据
// function mapStateToProps(state) {
//     return {
//         tiger: state
//     }
// }
 
// //需要触发什么行为
// function mapDispatchToProps(dispatch) {
//     return {
//         PayIncrease: () => dispatch({ type: '涨工资' }),
//         PayDecrease: () => dispatch({ type: '扣工资' })
//     }
// }
 
// //连接组件， 通过connect将export default App修改为 export default connect(mapStateToProps)(App); 即可通过this.props 获取到store中数据 
 
// App = connect(mapStateToProps, mapDispatchToProps)(App)
 
// ReactDOM.render(
//     <Provider store={store}>
//         <App />
//     </Provider>,
//     document.getElementById('root')
// )
